<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>新美DSP系统</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<!--框架核心CSS库-->
		<link rel="stylesheet" href="/static/backend/plugins/layui/css/layui.css">
		<link rel="stylesheet" href="/static/backend/css/font-awesome.min.css">
		<link rel="stylesheet" href="/static/backend/css/global.css">
		<link rel="stylesheet" href="/static/backend/css/style.css">
		<script src="/static/backend/js/jquery/2.0.1/jquery.min.js"></script>
		
		
	</head>
	
	<body>
		<div class="layui-layout layui-layout-admin">
			
			<!-- 水平导航 -->
			<div class="layui-header header">
	<div class="layui-main">
		<a class="header-logo" href="/">
		  <b>新美控股</b> | DSP媒体服务
		</a>
		
		<!-- 消息提示 -->
		<div id="messages" class="header-menu">
			<div class="ssp-bulletin-package">
				<div class="message-num">0</div>
			</div>
			
		</div>
		<!-- 消息提示 end -->
		
		<!-- 用户信息 -->
		<div id="accounts" class="header-menu header-drop-down-menu">
			<div id="user-name" class="title" title="">
				<i class="ui-icon-user"></i><span>新美控股</span><i class="ui-icon-caret-down"></i>
			</div>
			<ul id="account-detail">
				<li>
					<a href="/passport/account"><i class="ui-icon-cog"></i>账号管理</a>
				</li>
				<li>
					<a href="/passport/logout"><i class="ui-icon-power-off"></i>退出</a>
				</li>
			</ul>
		</div>
		
		<!-- 用户信息 end -->
		
		
	</div>
</div>
			<!-- 水平导航 end-->
			
			<!-- 侧边导航 -->
			<div class="layui-side layui-bg-gray">
    <div class="layui-side-scroll">
      
		<ul class="layui-nav layui-nav-tree" lay-filter="navTree">
			<li class="layui-nav-item sidebar-menu-home">
				<a class="sidebar-menu-title" href="/main/index" data-pjax>
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">首页</span>
				</a>
			</li>
			<li class="layui-nav-item sidebar-menu-delivery">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i> 
					<span class="sidebar-menu-text">投放管理</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
				  <dd class="">
					<a href="/AdOrder/index" data-pjax>订单管理</a>
				  </dd>
				  <dd class="">
					<a href="/AdDelivery/index" data-pjax>广告投放管理</a>
				  </dd>
				  <dd class="">
					<a href="/ad/index" data-pjax>物料管理</a>
				  </dd>
					<dd class="">
						<a href="/adGame/index" data-pjax>游戏管理</a>
					</dd>
				</dl>
			</li>
			
			<li class="layui-nav-item sidebar-menu-resource">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">资源管理</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
				  <dd class="">
					<a  href="/code/index" data-pjax>代码位管理</a>
				  </dd>
				</dl>
			</li>
			<li class="layui-nav-item sidebar-menu-report">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">财务管理</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
					<dd class="">
						<a  href="/finance/index" data-pjax>财务报告</a>
					</dd>
				</dl>
			</li>
			
			<li class="layui-nav-item sidebar-menu-report">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">报告</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
				  <dd class="">
					<a  href="/report/total" data-pjax>整体报告</a>
				  </dd>
				  <dd class="">
					<a  href="/report/adPosition" data-pjax>资源报告</a>
				  </dd>
				  <dd class="">
					<a  href="/report/delivery" data-pjax>投放报告</a>
				  </dd>
				  <dd class="">
				  	<a  href="/report/game" data-pjax>游戏报告</a>
				  </dd>
				</dl>
			</li>

			<span class="layui-nav-bar" style="top: 22.5px; height: 0px; opacity: 0;"></span>
		</ul>

    </div>
  </div>
			<!-- 侧边导航 end-->
		

			<!-- 右侧主体内容 -->
			<div class="layui-body">
				<div class="layui-content dsp-content" id="pjaxContent">
					
	<link rel="stylesheet" href="/static/backend/css/report.css">
	<link rel="stylesheet" href="/static/backend/plugins/layui/css/modules/layer/default/layer.css"  media="all">
	<script src="/static/backend/plugins/echarts/echarts.js"></script>
	<div class="page-crumb">
		<div class="ui-ctrl ui-crumb"><span class="ui-crumb-node ui-crumb-node-first ui-crumb-node-last">资源报告</span></div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<input class="layui-input" name="begin" placeholder="请选择开始时间" value="<?php echo ($data["begin"]); ?>" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD'})">
			</div>至
			<div class="layui-inline">
				<input class="layui-input" name="end" placeholder="请选择结束时间"  value="<?php echo ($data["begin"]); ?>" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD'})">
			</div>
			<button class="layui-btn layui-btn-min" lay-submit="" lay-filter="submit" id="ssss">　　确定　　</button>
		</div>


	</div>
	<div class="ui-nav-tab">
		<a class="nav-item state-active" href="/report/adPosition" data-pjax>代码位报告</a>
	</div>
	<div class="layui-main">
		<div class="report-view">
			<div class="report-general">
				<ul class="general-detail">
					<li class="general-detail-item general-detail-item-view">
						<p class="general-detail-item-base">
							<span class="general-detail-item-data" id="view"></span>
						</p>
						<p class="general-detail-item-name">展现量</p>
					</li>
					
					<li class="general-detail-item general-detail-item-click">
						<p class="general-detail-item-base">
							<span class="general-detail-item-data" id="click"></span>
						</p>
						<p class="general-detail-item-name">点击量</p>
					</li>
					
					<li class="general-detail-item general-detail-item-click-ratio">
						<p class="general-detail-item-base">
							<span class="general-detail-item-data" id="click_rate_sum"></span>
						</p>
						<p class="general-detail-item-name">点击率</p>
					</li>
					
				</ul>
				<div class="ui-ctrl ui-crumb"><span class="ui-crumb-node ui-crumb-node-first ui-crumb-node-last">趋势图</span>
				</div>
			</div>
		</div>
	</div>

	<div id="main" style="width: 1673px;height:300px;">

	</div>
	<div class="layui-form-item">
		<label class="layui-form-label">筛选：</label>
		<div class="layui-input-inline">
			<select name="codeid" lay-verify="codeid" lay-filter="codid" id="code_select">
				<option value="">请选择：</option>
				<?php if(is_array($code)): foreach($code as $k=>$ret): ?><option value="<?php echo ($ret["id"]); ?>"><?php echo ($ret["code_name"]); ?></option><?php endforeach; endif; ?>
			</select>
		</div>

		<button class="layui-btn layui-btn-min" lay-submit="" lay-filter="submit" id="code_screen">　　确定　　</button>
	</div>
	<table class="layui-table list-content-table" lay-skin="nob">
		<colgroup>
			<col width="20">
			<col width="200">
			<col width="150">
			<col width="200">
			<col width="200">
			<col width="150">
			<col width="150">
		</colgroup>
		<thead class="list-table-head">
		<tr>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text ui-table-hcell-text-first">

				</div>
			</th>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text">代码位名称</div>
			</th>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text">代码位ID</div>
			</th>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text">数据来源</div>
			</th>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text">展现量</div>
			</th>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text">点击量</div>
			</th>
			<th class="ui-table-hcell">
				<div class="ui-table-hcell-text">点击率</div>
			</th>
		</tr>
		</thead>

		<tbody class="list-table-body" id="each">

		</tbody>
	</table>
	<script type="text/javascript">


	</script>


	<script>

	</script>
	<script>
        $(document).ready(function(){
            $.ajax({
                type:"get",
                url:'/Elastic/code_Statistics',
                dataType:"json",
                success: function(data){

                    if(data.status == '1') {
                        $("#view").text(data.data.view_sum);
                        $("#click").text(data.data.click_sum);
                        $("#click_rate_sum").text(data.data.click_rate_sum +='%');
						console.log(data.data);

                        var str = '';
						$.each(data.data.code_list,function(index,item){
                            str += "<tr><td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>  </div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_name + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.codeid + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>dsp</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_view + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_click + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_click_rate + "%</div></td></tr>";

                        });
						$('#each').append(str);


                        showEchart(data.data);
                    } else {
                        console.log('没接收到返回数据');
                    }
                    return false;
                }
            });
        });
        $("#ssss").click(function () {
           var begin =$(" input[ name='begin' ] ").val();
           var  end  =$(" input[ name='end' ] ").val();
            $.ajax({
                type:"get",
                url:'/Elastic/code_Statistics',
                dataType:"json",
                data:{'begin':begin,'end':end},
                success: function(data){

                    if(data.status == '1') {

                        $("#view").text(data.data.view_sum);
                        $("#click").text(data.data.click_sum);
                        $("#click_rate_sum").text(data.data.click_rate_sum +='%');

                        var str = '';
                        $.each(data.data.code_list,function(index,item){
                            str += "<tr><td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>  </div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_name + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.codeid + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>dsp</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_view + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_click + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_click_rate + "%</div></td></tr>";


                        });
                        $('#each').empty();
                        $('#each').append(str);

                     	showEchart(data.data);
                    } else {
                        console.log('没接收到返回数据');
                    }
                    return false;
                }
            });
        });
        $("#code_screen").click(function () {
            var begin =$(" input[ name='begin' ] ").val();
            var  end  =$(" input[ name='end' ] ").val();
			var  codeid =$("#code_select").val();
			console.log(codeid);
            $.ajax({
                type:"get",
                url:'/Elastic/code_Statistics',
                dataType:"json",
                data:{'begin':begin,'end':end,'codeid':codeid},
                success: function(data){

                    if(data.status == '1') {

                        $("#view").text(data.data.view_sum);
                        $("#click").text(data.data.click_sum);
                        $("#click_rate_sum").text(data.data.click_rate_sum +='%');
                        console.log(data.data.code_list);
                        var str = '';

                        $.each(data.data.code_list,function(index,item){
                            console.log(item.code_click);
                            str += "<tr><td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>  </div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_name + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.codeid + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>dsp</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_view + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_click + "</div></td>";
                            str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.code_click_rate + "%</div></td></tr>";

                        });
                        $('#each').empty();
                        $('#each').append(str);

                        showEchart(data.data);


                    } else {
                        console.log('没接收到返回数据');
                    }
                    return false;
                }
            });
        });

       function showEchart(data) {

           var myChart = echarts.init(document.getElementById('main'));

           option = {

               tooltip : {

//                   formatter: function (params) {
//                       console.log(params);
//                       var str = params[0].name +"<br />";
//                       str += params[0].seriesName + ": " + params[0].value + "<br />";
//                       str += params[1].seriesName + ": " + params[1].value + "<br />";
//                       str += params[2].seriesName + ": " + params[2].value + "<br />";
//                       str += params[3].seriesName + ": " + params[3].value + "%<br />";
//                       return str;
//                   },

                   trigger: 'axis'

               },

               legend: {

                   data:['展现量','点击量','点击率(%)']


               },

               toolbox: {

                   show : true,

                   feature : {

                       mark : {show: true},

                       dataView : {show: true, readOnly: false},

                       magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},

                       restore : {show: true},

                       saveAsImage : {show: true}

                   }

               },

               calculable : true,

               xAxis : [

                   {

                       type : 'category',

                       boundaryGap : false,

                       data:data.time

                   }

               ],

               yAxis : [

                   {

                       type : 'value',
                       splitLine:{
                           show:false
                       }

                   }

               ],

               series : [

                   {

                       name:'展现量',

                       type:'line',

                       smooth:true,

                       itemStyle: {
                           normal: {
                               color: '#40E0D0',
                               borderColor: 'rgba(64,224,208,0.27)',
                               borderWidth: 12

                           }
                       },
                       areaStyle: {
                           normal: {
                               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                   offset: 0,
                                   color: 'rgba(64,224,208, 0.3)'
                               }, {
                                   offset: 0.8,
                                   color: 'rgba(64,224,208, 0.3)'
                               }], false),
                               shadowColor: 'rgba(0, 0, 0, 0.1)',
                               shadowBlur: 10
                           }
                       },

                       data:data.view

                   },

                   {

                       name:'点击量',

                       type:'line',

                       smooth:true,

                       itemStyle: {
                           normal: {
                               color: '#EE82EE',
                               borderColor: 'rgba(238,130,238,0.27)',
                               borderWidth: 12

                           }
                       },
                       areaStyle: {
                           normal: {
                               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                   offset: 0,
                                   color: 'rgba(238, 130, 238, 0.3)'
                               }, {
                                   offset: 0.8,
                                   color: 'rgba(238, 130, 238, 0.3)'
                               }], false),
                               shadowColor: 'rgba(238, 130, 238, 0.1)',
                               shadowBlur: 10
                           }
                       },


                       data:data.click

                   },
                   {

                       name:'点击率(%)',

                       type:'line',

                       smooth:true,

                       itemStyle: {
                           normal: {
                               color: '#FFD770',
                               borderColor: 'rgba(255,215,0,0.27)',
                               borderWidth: 12

                           }
                       },
                       areaStyle: {
                           normal: {
                               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                   offset: 0,
                                   color: 'rgba(255,215,0, 0.3)'
                               }, {
                                   offset: 0.8,
                                   color: 'rgba(255,215,0, 0.3)'
                               }], false),
                               shadowColor: 'rgba(255,215,0, 0.1)',
                               shadowBlur: 10
                           }
                       },


                       data:data.click_rate

                   }

               ]

           };
           // 使用刚指定的配置项和数据显示图表。
           myChart.setOption(option);
       } 
	</script>

				</div>
				<div class="loading-model">
					<div class="spinner">
					  <div class="bounce1"></div>
					  <div class="bounce2"></div>
					  <div class="bounce3"></div>
					</div>
				</div>
			</div>

		</div>
		
		
		<!--框架核心JS库-->
		<script src="/static/backend/plugins/layui/layui.js"></script>
		<script src="/static/backend/js/jquery.pjax.min.js"></script>
		<script src="/static/backend/js/underscore-min.js"></script>
		<script src="/static/backend/js/global.js"></script>
		
	</body>
	
</html>